<template>
	<view>
		<v-modal :show="visible" @cancel="onCancel">
			<view class="popup-cont">
				<view class="flex align-center fn-25 fn-w hairline--bottom mb-30" style="padding-bottom: 30rpx;">免责条款</view>
				<scroll-view class="scroll-view" scroll-y="true" >
					<jyf-parser ref="article"></jyf-parser>
				</scroll-view>
				
				<button open-type="getUserInfo" @getuserinfo="bindGetUserInfo">
					<view @click="onClickConsent" class="flex align-center vertical-center mt-30">
						<text style="font-size: 30rpx;" :class=" isConsent ? 'icon-squarecheckfill' : 'icon-square' "></text>
						<text class="ml-10 fn-25">我同意免责条款的内容</text>
					</view>
				</button>
				
				<view class="mt-30">
					<v-button v-if="!isConsent" @onclick="onTishi(isConsent)">登   录</v-button>
					<v-button v-if="isConsent" :is-phone="true" @colse="()=> this.$emit('cancel')">登   录</v-button>
				</view>
			</view>
		</v-modal>
	</view>
</template>

<script>
	import { toast } from "@/utils/util.js";
	import UserApi from "@/api/user.js";
	import vModal from '@/components/modal/modal.vue';
	import vButton from '@/components/button/button.vue';
	import jyfParser from "@/components/jyf-parser/jyf-parser.vue";

	export default {
		components: {
			vModal,
			vButton,
			jyfParser
		},
		data () {
			return {
				visible: false,
				isConsent: false
			}
		},
		// 计算属性
		computed: {
			userAccredit() {
				return this.$store.state.userAccredit;
			}
		},
		mounted() {
			this.setIsConsent();
			this.getDisclaimer();
			setTimeout(()=> this.visible = true, 20);
		},
		methods: {
			setIsConsent() {
				uni.getSetting({
					success: res => this.isConsent = !res.authSetting['scope.userInfo']
				})
			},
			async getDisclaimer() {
				const res = await UserApi.GetDisclaimer()
				this.$refs.article.setContent(res.info)
			},
			onCancel() {
				this.visible = false;
				setTimeout(()=> this.$emit("cancel"), 300);
			},
			onTishi() {
				toast("请先同意免责条款")
			},
			bindGetUserInfo(e) {
				if (e.detail.userInfo) {
					this.$store.commit('setUserInfo', {
						nickName: e.detail.userInfo.nickName,
						avatarUrl: e.detail.userInfo.avatarUrl,
					})
					// 用户按了允许授权按钮
					this.isConsent = true
					// 用户按了允许授权按钮
					UserApi.UpdateUserInfo(e.detail.userInfo)
						.then((res)=>{})
				} else {
					//用户按了拒绝按钮
					uni.showModal({
						title: '提示',
						content: '为了更好的服务，请允许授权登录.',
						showCancel: false,
						confirmText: '返回授权',
						confirmColor: '#1BAC1A'
					});
				}
			},
		}
	}
</script>

<style lang="scss" scoped>
	.popup-cont{
		box-sizing: border-box;
		width: 697rpx;
		padding: 30rpx 40rpx;
		background-color: #fff;
		border-radius: 10rpx;
		.scroll-view{
			height: 666rpx;
		}
	}
	button{
		background-color: #fff;
		padding: 0;
		height: auto;
		line-height: 0;
	}
button::after {
	border: none;
}
</style>
